﻿<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>个人博客网站</title>
    <link rel="shortcut icon" href="../images/Logo_40.png" type="image/x-icon"/>

    <head th:include="/new/head::blog_head"></head>
    <link th:href="@{/style/easyCss/css/home.css}" rel="stylesheet" />
</head>
<body>
    <!-- 导航 -->
  <div class="blog-masthead" th:include="/blog/public/top::topv2"></div>
    <!-- 主体（一般只改变这里的内容） -->
    <div class="blog-body">
        <!-- canvas -->
        <!--<canvas id="canvas-banner" style="background: #393D49;"></canvas>-->
        <!--&lt;!&ndash;为了及时效果需要立即设置canvas宽高，否则就在home.js中设置&ndash;&gt;-->
        <!--<script type="text/javascript">-->
            <!--var canvas = document.getElementById('canvas-banner');-->
            <!--canvas.width = window.document.body.clientWidth - 10;//减去滚动条的宽度-->
            <!--if (screen.width >= 992) {-->
                <!--canvas.height = window.innerHeight * 1 / 3;-->
            <!--} else {-->
                <!--canvas.height = window.innerHeight * 2 / 7;-->
            <!--}-->
        <!--</script>-->
        <!-- 这个一般才是真正的主体内容 -->
        <div class="blog-container">
            <div class="blog-main">
                <!-- 网站公告提示 -->
                <!--<div class="home-tips shadow">-->
                    <!--<i style="float:left;line-height:17px;" class="fa fa-volume-up"></i>-->
                    <!--<div class="home-tips-container">-->
                        <!--<span style="color: #009688">偷偷告诉大家，本博客的后台管理也正在制作，为大家准备了游客专用账号！</span>-->
                    <!--</div>-->
                <!--</div>-->
                <!--左边文章列表-->
                <div class="blog-main-left" >
                    <div class="article shadow" th:each="article:${articles}">
                        <div class="article-right">
                            <div class="article-title">
                               <a th:href="@{/article/details(id=${article.id})}"  th:text="${article.title}">基于laypage的layui扩展模块（pagesize.js）！</a>
                            </div>
                            <div class="article-abstract"
                                    th:text="${#strings.length(article.summary)>100 ? #strings.substring(article.summary,0,100) : article.summary}">
                            </div>
                        </div>
                        <div class="clear"></div>
                        <div class="article-footer">
                            <span><i class="fa fa-clock-o" th:text="${#dates.format(article.articleDate,'yyyy-MM-dd hh:mm:ss')}"></i>&nbsp;&nbsp;</span>
                            <span class="article-author" ><i class="fa fa-user"></i>&nbsp;&nbsp;作者</span>
                            <span><i class="fa fa-tag" ></i>&nbsp;&nbsp;<a th:text="${article.tag}">tag</a></span>
                            <span  class="article-viewinfo" ><i class="fa fa-thumbs-o-up" th:text="${article.enjoy}"></i>&nbsp;</span>
                            <span class="article-viewinfo" ><i class="fa fa-thumbs-o-down" th:text="${article.Hate}"></i>&nbsp;</span>
                        </div>
                    </div>
                </div>
                <!--右边小栏目-->
                <div class="blog-main-right">
                    <div></div><!--占位-->
                    <div class="blog-module shadow">
                        <div class="blog-module-title">热文排行</div>
                        <ul class="fa-ul blog-module-ul">
                        <li><i class="fa-li fa fa-hand-o-right"></i>没有</li>
                        </ul>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
    <!-- 底部 -->
  
    <div th:include="/blog/public/left::left"></div>
    <!--遮罩-->
    <div class="blog-mask animated layui-hide"></div>

</body>
</html>